<template>
  <div>
    基础用法：<br>
    <wanglei-radio label="篮球" v-model="hobby" @change="onChange"></wanglei-radio>
    <wanglei-radio label="足球" v-model="hobby"></wanglei-radio>
  </div>

  <div>
    禁用状态：<br>
    <wanglei-radio disabled label="禁用" v-model="radioVal">选项一</wanglei-radio>
    <wanglei-radio disabled label="选中且禁用" v-model="radioVal">选项二</wanglei-radio>
  </div>

  <div>
    单选框组：<br>
    <wanglei-radio-group v-model="radioGroupValue">
      <wanglei-radio :label="3">备选项</wanglei-radio>
      <wanglei-radio :label="6">备选项</wanglei-radio>
      <wanglei-radio :label="9">备选项</wanglei-radio>
    </wanglei-radio-group>
  </div>
</template>

<script>
import { defineComponent, ref } from 'vue'
export default defineComponent({
  setup() {
    const hobby = ref('')
    const radioVal = ref('选中且禁用')
    const onChange = val => {
      console.log("val发生改变了", val);
    }

    const radioGroupValue = ref(3)
    return {
      hobby,
      radioVal,
      onChange,
      radioGroupValue
    }
  }
})
</script>

<style scoped>

</style>
